<template>
<div class="item">
    <img :src="item.pic">
        <div class="item_right">
            <div class="title">{{ item.title }}</div>
            <div class="salas">{{item.sales}}</div>
            <div class="price">{{ item.price }} 免配送费</div>
        <div>
            <span v-for="s in item.ladel">{{ s }}</span>
        </div>
    </div>
</div>
</template>

<style lang="less">
    .item{
        display: flex;
    }
    img{
        width: 120px;
        height: 120px;
    }
    .item_right{
        margin-left: 30px;
        line-height: 20px;
    }
    .title{
        font-size: 20px;
        font-weight: bold;
    }

    .span{
        background-color: burlywood;
        padding: 2px 10px;
        border-radius: 5px;
    }
</style>

<!-- 父组件向子组件传参 -->
<script>
    export default {
        props:['item']
    }
</script>